<%inherit file="/base.html"/>

<%def name="extra_css()">
	<link rel="stylesheet" type="text/css" href="${url('/css/worktime.css')}"/>
</%def>

<%def name="main_heading()">${c.employee.employee}</%def>

<%def name="content()">

<h4><a href="${url.current(action='index', relation='timesheet')}">&lt;&lt; ${_('Back to the timesheet')}</a></h4>

<form id="calendar" method="post">
	<table class="full-width">
		<tr>
			<td class="left-aligned half-width">
				% if c.previous:
				<input class="previous-button full-width" type="button" value="&lt;&lt; ${c.previous.employee}"/>
				<a id="previous-link" href="${url.current(record_id=c.previous.id)}"></a>
				% endif
			</td>
			<td>${h.save_button()}</td>
			<td class="right-aligned half-width">
				% if c.next:
				<input class="next-button full-width" type="button" value="${c.next.employee} &gt;&gt;"/>
				<a id="next-link" href="${url.current(record_id=c.next.id)}"></a>
				% endif
			</td>
		</tr>
		<tr>
			<td class="center-aligned" colspan="3">
				<table class="full-width">
					<tr>
						<td>
							<table class="timesheet-calendar full-width">
								% for week in c.calendar:
								<tr>
									% for day in week:
									<td id="monthday${day}" class="day-cell weekday${week.index(day)}">
										% if day:
											<span class="day-number">${day}</span>
											<br/>
											% if c.working_days.has_key(day):
											${h.dropdown('code%d' % day, c.working_days[day].code_id, c.codes)}
											% else:
											<input size=2 value=""/>
											% endif
											${h.dropdown('hours%d' % day, c.working_days[day].hours, ['--'] + range(25))}
										% endif
									</td>
									% endfor
								</tr>
								% endfor
							</table>
						</td>
						<td class="center-aligned">
							<h3>${_('Code')}:</h3>
							<p>
								<input id="apply-code" class="normal-button" type="button" value="&lt;&lt;"/>
								${h.dropdown('begin-code', 1, range(1, 32))} -
								${h.dropdown('end-code', 31, range(1, 32))}
								${h.dropdown('shared-code', 0, c.codes)}
							</p>
							<h3>${_('Hours')}:</h3>
							<p>
								<input id="apply-hours" class="normal-button" type="button" value="&lt;&lt;"/>
								${h.dropdown('begin-hours', 1, range(1, 32))} -
								${h.dropdown('end-hours', 31, range(1, 32))}
								${h.dropdown('shared-hours', '--', ['--'] + range(25))}
							</p>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>
</form>

<script type="text/javascript">

$('#apply-code').click(function() {
	var code = $('#shared-code').val();
	var begin = parseInt($('#begin-code').val());
	var end = parseInt($('#end-code').val());
	for(i=begin; i<=end; i++) {
		$('#code' + i).val(code);
	}
});

$('#apply-hours').click(function() {
	var hours = $('#shared-hours').val();
	var begin = parseInt($('#begin-hours').val());
	var end = parseInt($('#end-hours').val());
	for(i=begin; i<=end; i++) {
		$('#hours' + i).val(hours);
	}
});

$('.previous-button').click(function() {
	href = $('#previous-link').attr('href');
	window.location.href = href;
});

$('.next-button').click(function() {
	href = $('#next-link').attr('href');
	window.location.href = href;
});

</script>

</%def>